<template>
  <section class="setting-bg pv-12 ph-16">
    <section>
      <div style="max-width: 400px;justify-content: space-between;" class="flex-row-center">
        <div class="fs-base font-w">允许租客远程开锁</div>
        <el-switch
          v-model="allowRemote"
          inline-prompt
          :active-icon="Check"
          :inactive-icon="Close"
        />
      </div>
      <div class="fc-regular fs-base">
        门锁联网才能使用
      </div>
    </section>
    <section class="mt10">
      <div style="max-width: 400px;justify-content: space-between;" class="flex-row-center">
        <div class="fs-base font-w">允许租客获取房间锁单次密码</div>
        <el-switch
          v-model="allowRoomSingle"
          inline-prompt
          :active-icon="Check"
          :inactive-icon="Close"
        />
      </div>
      <div class="fc-regular fs-base">
        租客可在电子钥匙的授权时间内获取房间锁单次密码
      </div>
    </section>
    <section class="mt10">
      <div style="max-width: 400px;justify-content: space-between;" class="flex-row-center">
        <div class="fs-base font-w">允许租客获取公区锁单次密码</div>
        <el-switch
          v-model="allowPublicSingle"
          inline-prompt
          :active-icon="Check"
          :inactive-icon="Close"
        />
      </div>
      <div class="fc-regular fs-base">
        租客可在电子钥匙的授权时间内获取公区锁单次密码
      </div>
    </section>
  </section>
</template>
<script setup name="RentAuth">
import { Check, Close, Remove } from '@element-plus/icons-vue'

const allowRemote = ref(false)
const allowRoomSingle = ref(false)
const allowPublicSingle = ref(false)
</script>
